<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>注册界面</title>
</head>
<link rel="stylesheet" href="css/register.css">

<body>
    <div id="heard">
        <!-- 头部 -->
        <h3> 哀 其 不 幸 , 怒 其 不 争 </h3>
    </div><!-- heard -->

    <div id="register_farme">
        <h1>
            注 册 界 面
        </h1>
        <form id="registerForm" action="/registerDone" method="POST">
            <ul>
                <li class="li_username">

                    <input type="text" id="username" name="username" placeholder="                       创建用户名"
                        style="font-size: 20px;color: papayawhip;" />
                </li>

                <li class="li_password">

                    <input type="password" id="password" name="password" placeholder="                         创建密码"
                        style="font-size: 20px;color: papayawhip;" />
                </li>

                <li class="li_confirmPassword">

                    <input type="password" id="confirmPassword" name="confirmpassword"
                        placeholder="                         确认密码" style="font-size: 20px;color: papayawhip;" />

                </li>
            </ul>
            <button id="ConfirmRegistration" type="button" onclick="sup()">确认注册</button>

            <button id="Unregister" type="button" onclick="xxx()">取消注册</button>
        </form>
    </div><!-- register_farme -->

    <script src="js/jquery-3.6.0.min.js"></script>
    <script>
        function xxx() {
            window.location.href = '/';
        }

        function sup() {
            let username = $('#username').val();
            let password = $('#password').val();
            let confirmPassword = $('#confirmPassword').val();
            if (username.length > 0&& password.length>0&&password===confirmPassword) {
                $.ajax({
                    url: "/registerDone",
                    type: "POST",
                    data: $('#registerForm').serialize(),
                    dataType: "json",
                    success: function (res) {
                        if(res.code===200){
                            window.location.href="/";
                        }
                    }
                })
            } else {
                alert('aaa')
            }
        }
        // function alert_fn(msg) {
        //     msg = msg || '密码不能为空，两次密码应该一致';
        //     // 替换提示的内容
        //     $('#msg').text(msg);
        //     // 移除不显示的class，则alert将显示
        //     $('.invisible').removeClass('invisible');
        //     // 三秒中后，给alert增加不显示的class，则alert重新隐藏
        //     setTimeout(() => {
        //         $('.alert').addClass('invisible');
        //     }, 3000);
        // }
    </script>
</body>

</html>